import React from "react";
import { TouchableOpacity, Text, View, Alert } from "react-native";
import { useTheme } from "@/contexts/ThemeContext";
import { MaterialIcons } from "@expo/vector-icons";
import { createStyles } from "./index.style";

const DeleteChatRecords = () => {
  const { colors } = useTheme();
  const styles = createStyles(colors);

  const handleDelete = () => {
    // 实现清空聊天记录的逻辑
    Alert.alert(
      "清空聊天记录",
      "确定要清空此群聊的聊天记录吗？此操作不可恢复。",
      [
        {
          text: "取消",
          style: "cancel",
        },
        {
          text: "确定",
          onPress: () => console.log("清空聊天记录确认"),
          style: "destructive",
        },
      ],
      { cancelable: true }
    );
  };

  return (
    <TouchableOpacity style={styles.actionButton} onPress={handleDelete}>
      <View style={[styles.buttonContainer, styles.deleteButton]}>
        <MaterialIcons name="delete" size={24} style={styles.iconColor} />
      </View>
      <Text style={styles.buttonText}>清空聊天记录</Text>
    </TouchableOpacity>
  );
};

export default DeleteChatRecords;
